<template>
    <el-table :data="list" style="width: 100%">
      <el-table-column label="选择" width="55" @change="changeHandle(scope.$index)">
        <template #default="scope">
          <el-checkbox v-model="scope.row.state" size="large"/></template>
      </el-table-column>

      <el-table-column label="编号" width="120">
        <template #default="scope">{{ scope.row.id }}</template>
      </el-table-column>
      <el-table-column label="待办事项" width="200">
        <template #default="scope">{{ scope.row.content }}</template>
      </el-table-column>
      <el-table-column label="创建时间" width="120">
        <template #default="scope">{{ scope.row.startDate }}</template>
      </el-table-column>
      <el-table-column label="完成时间" width="120">
        <template #default="scope">{{ scope.row.finishDate }}</template>
      </el-table-column>
      <el-table-column fixed="right" label="删除" min-width="60">
        <template #default="scope">
            <el-button
            link
            type="primary"
            size="small"
            @click.prevent="deleteRow(scope.$index)"
            >
            删除
            </el-button>
        </template>
      </el-table-column>
    </el-table>
  </template>

<script>
import{ElMessageBox}from 'element-plus'
export default {
  props:{
    list:Array
  },
  methods: {
    changeHandle(i){
      ElMessageBox.confirm(
        '此项任务真的完成了吗？',
        'Warning',
        {
          confirmButtonText:'确定',
          cancelButtonText:'手抖',
          type:'warning',
        }
      )
        .then(()=>{
          this.$emit('changeD',i)
        })
        .catch(()=>{
          this.list1[i].state = false

        })
    },
    deleteRow(i){
      ElMessageBox.confirm(
        '确定要删除吗？',
        'Warning',
        {
          confirmButtonText:'确定',
          cancelButtonText:'手抖了',
          type:'Warning',
        }
      )
      .then(()=>{
          this.$emit('del', i)
        })
        .catch(()=>{
          

        })
    }
  },
}
</script>